<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>修改</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="format-detection" content="telephone=no">
		<!-- jQuery-->
		<script type="text/javascript" src="/static/plugins/jquery/jquery-3.6.0.min.js"></script>

		<!-- layui-->
		<link rel="stylesheet" href="/static/plugins/layui/2.8.4/css/layui.css" media="all">
		<script src="/static/plugins/layui/2.8.4/layui.js" charset="utf-8"></script>
		
		
	</head>
	<style>
		.all-view{
			width: 90%;
			margin: 0 auto;
			margin-top: 20px;
		}
		.btn-view{
			margin-bottom: 10px;
			
		}
		.add-btn{
			width:120px;
		}
		.bottom-view{
			position: fixed;
			bottom: 0;
			width: 100%;
		}
		.add-btn-view{
			width: 260px;
			margin: 0 auto;
			margin-bottom: 40px;
		}
	</style>
	
	<body>
		
		<!--头部输入框-->
		
		<form class="layui-form layui-form-pane all-view" action="">


			<div class="layui-form-item">
				<label class="layui-form-label">场景名称</label>
				<div class="layui-input-block">
				  <input type="text" name="sceneName" id="sceneName" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
				</div>
			  </div>



		
			<div class="layui-form-item layui-form-text" id="general-txt">
				<label class="layui-form-label">描述</label>
				<div class="layui-input-block">
				  <textarea placeholder="请输入内容" class="layui-textarea" id="information" style="white-space: pre-line;height: 200px;" maxlength="300"></textarea>
					<div><span id="textCount">0</span>/<span id="inputMaxTxt">100</span></div>
				</div>
			  </div>


			<div class="layui-form-item">
				<label class="layui-form-label">场景标识<i class="layui-icon layui-icon-question" id="backNum" style="color: #ffa33a;padding-left: 5px; cursor: pointer;" ></i></label>
				<div class="layui-input-block">
					<input type="text" name="sceneKey" id="sceneKey" lay-verify="required" placeholder="请输入" autocomplete="off" class="layui-input">
				</div>
			</div>


			<div class="layui-form-item">
				<label class="layui-form-label">排序</label>
				<div class="layui-input-block">
					<div style="float: left;margin-right: 5px;margin-left: 10px;">
						<button type="button" class="layui-btn layui-btn-sm" onclick="phaseNumDown()" style="height: 38px;">
							<i class="layui-icon layui-icon-subtraction"></i>
						</button>
					</div>
					<input type="number" name="sort" id="sort" autocomplete="off"
						   readonly="readonly"  class="layui-input" style="float: left;width: 200px;text-align: center;margin-right: 5px;" >
					<div style="float: left;">
						<button type="button" class="layui-btn layui-btn-sm" onclick="phaseNumAdd()" style="height: 38px;">
							<i class="layui-icon layui-icon-add-1"></i>
						</button>
					</div>
				</div>
			</div>


      </form>

      <div class="bottom-view">
          <div class="layui-btn-container add-btn-view">
            <button type="button" class="layui-btn layui-btn-primary layui-border-blue add-btn" onclick="toAdd();">确定</button>
            <button type="button" class="layui-btn layui-btn-primary layui-border add-btn" onclick="toClose();">取消</button>
          </div>
      </div>


		<input type="hidden" name="id" id="id" value=""><!--信息id-->


      <script>
		  $('#id').val('[(${dto.id})]');
		  var tipIndex = null;
		  $("#backNum").mouseover(function() {
			  tipIndex = layer.tips("场景标识必须唯一，建议设置为场景名称的英文形式。例如：测试AI => testAi。", this, {tips: [2, "#C1C1C1"],time:0});
		  });
		  $("#backNum").mouseout(function() {layer.close(tipIndex);});

		  $.ajax({
			  url : '/api/inter/eKnowScene/getEKnowSceneInfoById',
			  data : {id:$('#id').val()},
			  type : 'POST',
			  async : false,
			  success : function(result) {
				  if(result.code=='SUCCESS'){
					  var eKnowScene = result.eKnowScene;
					  if(eKnowScene!=null){
						  $('#sceneName').val(eKnowScene.sceneName);
						  $('#sceneKey').val(eKnowScene.sceneKey);
						  $('#sort').val(eKnowScene.sort);
						  $('#information').val(eKnowScene.sceneDescribe);
						  var information = document.getElementById('information');
						  $('#textCount').text(txtCount(information));
					  }

				  }else{
					  layer.msg('不好意思，系统出现问题了，请稍后重试！', {icon: 2});
					  setTimeout(function(){
						  window.parent.layer.closeAll();
					  }, 1000);
				  }
			  }
		  });

		  //var information = $('#information').val();
		  var information = document.getElementById('information');
		  $('#textCount').val(txtCount(information));



		  function toClose() {
			  window.parent.layer.closeAll();
		  }

		  function toAdd() {
			  var id = $('#id').val();
			  var sceneName = $('#sceneName').val();
			  var sceneKey = $('#sceneKey').val();
			  var sort = $('#sort').val();
			  var information = $('#information').val();
			  if(sceneName ==undefined || sceneName ==null || sceneName =='' ){
				  layer.msg('请填写场景名称', {icon: 0});
				  return ;
			  }
			  if(sceneKey ==undefined || sceneKey ==null || sceneKey =='' ){
				  layer.msg('请填写场景标识', {icon: 0});
				  return ;
			  }
			  if(sort ==undefined || sort ==null || sort =='' ){
				  layer.msg('请设置排序', {icon: 0});
				  return ;
			  }
			  if(information ==undefined || information ==null || information =='' ){
				  layer.msg('请填写场景描述', {icon: 0});
				  return ;
			  }

			  layui.layer.msg('保存中', {icon: 16,shade: 0.01});
			  $.ajax({
				  url: '/api/inter/eKnowScene/updateEKnowScene',
				  data: {
					  'id':id,
					  'sceneName':sceneName,
					  'sceneKey':sceneKey,
					  'sceneDescribe':information,
					  'sort':sort,
				  },
				  type: 'POST',
				  async: true,
				  success: function (result) {
					  layer.close();
					  console.log('result:',result);
					  if(result.code=='SUCCESS'){
						  layer.msg("操作成功", {icon: 1});
						  setTimeout(function(){
							  window.parent.location.reload();
						  }, 1000);
					  }else if(result.code=='CANNOT'){
						  layer.close();
						  layer.msg('不好意思，场景标识重复，请重新填写场景标识！', {icon: 2});
					  }else if(result.code=='PARAMSERROR'){
						  layer.close();
						  layer.msg('不好意思，未查询到该场景信息！', {icon: 2});
					  } else{//失败
						  layer.close();
						  layer.msg('不好意思，系统出现问题了，请稍后重试！', {icon: 2});
					  }
				  },
				  error: function () {
					  layer.close();
					  layer.msg('不好意思，系统出现问题了，请稍后重试！', {icon: 2});
				  }
			  });
		  }


		  //输入框底下的字数变化监听
		  var el = document.getElementById('information');
		  el.addEventListener('input',function () {
			  var len =  txtCount(this); //   调用函数
			  document.getElementById('textCount').innerHTML = len;
		  });

		  //函数 - 获取文本内容和长度
		  function txtCount(el) {
			  var val = el.value;
			  var eLen = val.length;
			  return eLen;
		  }

		  //数字框减少
		  function phaseNumDown(){
			  var nowNum = $("#sort").val();
			  if( nowNum!=1 ){
				  $("#sort").val( parseInt(nowNum) - 1 );
			  }
		  }
		  //数字框增加
		  function phaseNumAdd(){
			  var nowNum = $("#sort").val();
			  $("#sort").val( parseInt(nowNum) + 1 );
		  }

      </script>

  </body>
</html>